<template>
    <view class="content1">
        <view v-for="(item,index) in consult" :key="index">
            <view class="consult2" @tap="bindMsg(item.id)">
                <view class="consult2-left">
                    <view>
                        <img :src="item.img"></img>
                    </view>
                </view>
                <view class="consult2-right">
                    <view class="consult2-right2">{{item.title}}</view>
                    <view class="consult2-right5" v-if="item.is_read == 1">已读</view>
                    <view class="consult2-right5" v-if="item.is_read == 0">未读</view>
                    <view class="consult2-right3">行业资讯</view>
                    <view class="consult2-right4">{{item.created_at}}</view>
                </view>
            </view>
        </view>

    </view>
</template>

<script>
import {
    request
} from "../../../comon/js/request.js"
export default {
    data() {
        return {
            consult:[],
            array: []
        }
    },
    methods: {
        bindMsg(id) {
            uni.navigateTo({
                url: `../detailed/detailed?id=${id}`
            })
        },
        // 获取咨询数据
        getMsg() {
            request({
                url: "v1/news/unread",
                method: "GET"
            }).then(res => {
                console.log(res, "获取资讯列表")
                this.consult = res.data.result
                // let arr = []
                // arr = res.data.result
                // this.num2 = arr.length
            })
        }
    },
    onLoad() {
        this.getMsg()
    }
}
</script>

<style lang="less">
page {
    background: #eff1f3;
}
.consult2 {
    // margin-left: 10rpx;
    margin-top: 20rpx;
    background: #f2f8fb;
    display: flex;
    // width: 750rpx;
    height: 200rpx;

    .consult2-left {
        img {
            // border: 1rpx solid ;
            height: 200rpx;
            width: 230rpx
        }
    }

    .consult2-right {
        // flex: 2;

        .consult2-right2 {
            position: relative;
            top: 31rpx;
            right: -11rpx;

        }

        .consult2-right5 {
            text-align: center;
            line-height: 40rpx;
            width: 80rpx;
            height: 40rpx;
            font-size: 28rpx;
            color: #005079;
            position: relative;
            top: -15rpx;
            right: -365rpx;

            background: #fedfe8;
            border-radius: 24rpx;
        }

        .consult2-right3 {
            position: relative;
            top: 40rpx;
            right: 0rpx;
            font-size: 26rpx;
            margin-top: 10rpx;
            text-align: center;
            line-height: 32rpx;
            width: 128rpx;
            height: 32rpx;
            background: #ECF2F5;
            border-radius: 24rpx;
            color: #005079;
        }

        .consult2-right4 {
            position: relative;
            top: 25rpx;
            right: -210rpx;
            display: flex;
            font-size: 20rpx;
            justify-content: space-between;
            color: #656565;
            letter-spacing: 0;
            line-height: 12rpx;
            display: flex;
            justify-content: space-between;

        }
    }
}
.content {
    margin-top: 24rpx;
    display: flex;
    height: 220rpx;

    image {
        width: 240rpx;
        height: 220rpx;
        // margin-left: 50rpx;
    }

    .contentMsg {
        font-size: 28rpx;
        color: #353535;
        letter-spacing: 0;
        line-height: 22rpx;
        // margin-left: 60rpx;

    }

    .contentTime {
        position: relative;
        top: 91rpx;
        display: flex;
        justify-content: space-between;
        font-size: 12rpx;
        color: #656565;
        letter-spacing: 0;
        line-height: 12rpx;
        display: flex;
        justify-content: space-between;

        // margin-left: 60rpx;
        // margin-top: 20rpx;
        .msg {
            margin-top: 10rpx;
            text-align: center;
            line-height: 32rpx;
            width: 128rpx;
            height: 32rpx;
            background: #ECF2F5;
            border-radius: 24rpx;
            color: #005079;
        }

    }

    .conten-right {
        background: #ffffff;
        padding: 24rpx;
        width: 445rpx;
    }

}
</style>
